<template>
	<view class="meeting_list">
		<view class="meeting_item" v-for="item in meetingList" :key="item.id">
			<view class="title">
				<text>{{item.meetingName}}</text>
			</view>
			<view class="right">
				<view class="content">
					<text>{{item.meetingStartTime}}~{{item.meetingFinishTime}}</text>
					<text>会议类型：{{item.meetingType}}</text>
				</view>
				<view class="operation">
					<u-button type="primary" size="large" text="会议详情" @click="navigator(item.id)"></u-button>
					<u-button type="primary" size="large" text="会议通知"></u-button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: ['meetingList'],
		methods: {
			navigator (id) {
				this.$emit('meetingItemClick',id)
			}
		}
	}
</script>

<style lang="scss">
	@import "@/static/css/_px2vw.scss";
	.meeting_item {
		display: flex;
		font-family:'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
		font-style:normal;
		padding:vw(3);
		margin: vw(3);
		border:solid #DDDDDD vw(1);
		.title{
			font-weight:700;
			text-align:center;
			width: 50%;
			line-height: vw(80);
			font-size:vw(18);
		}
		.right{
			display: flex;
			width: 50%;
			.content{
				display: grid;
				font-size:vw(14);
				line-height: vw(40);
			}
			.operation{
				display: grid;
				padding: 0 vw(26);
				text-align:center;
				uni-button{
					margin-top: vw(5);
					height: vw(30);
					/deep/ uni-text{
						font-size:vw(13) !important;
					}
				}
			}
		}
	}
</style>
